<template>
  <div v-loading="setLoading" element-loading-text="拼命加载中">
    <div class="settings-thumb">
      <i class="i-icon color-primary el-icon-view"></i>
      <h2 class="settings-name">夜审</h2>
      <el-switch v-model="seller.autoCheck" @change="checkChange" :active-value="1" :inactive-value="0" active-text="自动" class="switch" inactive-text="手动"></el-switch>
    </div>
    <div class="settings-intro">
      <div class="settings-description">
        <span>
          <el-form label-width="80px">
          <el-form-item label="夜审时间">
            <el-time-picker
             @change="pickerChange"
             size="small"
              style="width: 180px;"
              v-model="seller.setNightTrialTime"
              :picker-options="{
                selectableRange: '00:00:01 - 09:59:59'
              }"
              value-format="HH:mm:ss"
              placeholder="任意时间点">
            </el-time-picker>
          </el-form-item>
          <el-form-item label="自动交班">
            <el-switch v-model="seller.autoHand" @change="checkHandChange" :active-value="1" :inactive-value="0" active-text="已开" class="switch" inactive-text="已关"></el-switch>
          </el-form-item>
          </el-form>
        </span>
      </div>
      <!--<div class="settings-button">
        <a class="f14 color-blue" href="javascript:;">按钮</a>
      </div> -->
      <div id="printOperateController"></div>
    </div>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        setLoading:false,
        seller: {
          id: 0,
          sellerId: '',
          updateTime: '',
          autoCheck: '',
          autoHand: '',
          lastNightTrialTime: '',
          setNightTrialTime: '',
          lastNightState: ''
        }
      };
    },
    activated() {
      this.init()
    },
    methods: {
      pickerChange() {
        var data = {
          id: this.seller.id,
          setNightTrialTime: this.seller.setNightTrialTime
        }
        this.changeSubmit(data);
      },
      checkChange() {
        var data = {
          id: this.seller.id,
          autoCheck: this.seller.autoCheck
        }
        this.changeSubmit(data);
      },
      checkHandChange() {
        var data = {
          id: this.seller.id,
          autoHand: this.seller.autoHand
        }
        this.changeSubmit(data);
      },
      changeSubmit(data) {
        if (!this.seller.setNightTrialTime) {
          return false
        }
        this.setLoading = true;
        this.$http({
          url: this.$http.adornUrl(`/hotel/thotelnighttrial/update`),
          method: 'post',
          data: this.$http.adornData(data)
        }).then(({data}) => {
          if (data && data.code === 0) {
            this.init();
            this.$message({
              message: '操作成功',
              type: 'success',
              duration: 1500
            })
          } else {
            this.$message.error(data.msg)
          }
          this.setLoading = false;
        })
      },
      init() {
        this.setLoading = true;
        this.$http({
          url: this.$http.adornUrl(`/hotel/thotelnighttrial/seller`),
          method: 'get',
          params: this.$http.adornParams()
        }).then(({
          data
        }) => {
          if (data && data.code === 0) {
            this.seller = data.nightTrialEntity
          }
          this.setLoading = false;
        })
      }
    }
  };
</script>

<style lang="scss" scoped>
  .q-functions{
    .settings-intro {
      float: left;
      margin-top: 20px
    }
  }
</style>
